<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                template="./../templates/StakeholderPortalTemplate.xhtml">

    <link href="./../resources/css/default.css" rel="stylesheet" type="text/css" />
    <link href="./../resources/css/tableLayout.css" rel="stylesheet" type="text/css" />
    <h:head>
        <title>View Event</title>
    </h:head>
    <ui:define name="left">

    </ui:define>

    <ui:define name="content">
        <f:view beforePhase="#{editEventManagedBean.initView}">


            <h:body>



                <p:messages id="statusMessages" redisplay="false" />
                <p:panel header="Event Details" >

                    <h:panelGrid columns="2" cellspacing="2" cellpadding="9" width="780px;">
                        <h:column/>
                        <p:commandButton image="ui-icon ui-icon-trash" title="Delete" onclick="confirmation.show()" type="button"
                                         value="Delete Event" style="float: right;"/>  

                        <p:confirmDialog message="Are you sure about to delete the event?"  
                                         showEffect="bounce" hideEffect="fade"  
                                         header="Initiating delete process" severity="alert" widgetVar="confirmation">  

                            <p:commandButton value="Yes Sure" update="statusMessages" oncomplete="confirmation.hide()"   
                                             actionListener="#{editEventManagedBean.delete}">
                            </p:commandButton>  
                            <p:commandButton value="Not Yet" onclick="confirmation.hide()" type="button" />   

                        </p:confirmDialog>  
                        <h:column/>
                        <p:graphicImage value="#{editEventManagedBean.eventActivity.eventUrl}"
                                        style="width:300px; height: 200px;"/>


                        <h:column>

                            <h:outputText id="labelActivityType" value="#{bundle['activity.type'] } " style="font-weight: bold; vertical-align: text-top;
                                          float: left;" />
                            <h:outputText id="activityType" value="#{editEventManagedBean.eventActivity.activityType}"
                                          converter="activityTypeConverter"/>
                            <br/>
                            <br/>
                            <h:outputText id="labelEventTitle" value="Event Title *: " style="font-weight: bold" />
                            <h:outputText value="#{editEventManagedBean.eventActivity.eventName}" 
                                          id ="eventTitle" style="width:410px;" />
                            <br/><br/>
                            <h:outputText id="labelEventDesc" value="Event Desc *: " style="font-weight: bold" />
                            <h:outputText escape="false" value="#{editEventManagedBean.eventActivity.eventDesc}" 
                                          id ="eventDesc" style="width:310px;"/>
                        </h:column>

                    </h:panelGrid>
                    <p:separator/>

                    <h:panelGrid columns="2" cellspacing="2" cellpadding="9">
                        <h:outputText id="labelOrganiseTitle" value="#{bundle['organiser.title']} " style="font-weight: bold; width: 180px;" />
                        <h:outputText value="#{editEventManagedBean.eventActivity.organiser.organisationName}" 
                                      id ="organiserName" style="width:310px;" />
                        <h:outputText id="labelOrganiserDesc" value="#{bundle['organiser.Desc']} " style="font-weight: bold; width: 180px;" />
                        <h:outputText value="#{editEventManagedBean.eventActivity.organiser.organisationDesc}" id="organiserDesc"
                                      style="width: 310px; height: 210px;"/>


                    </h:panelGrid>
                    <p:separator />  
                    <h:panelGrid columns="2" cellspacing="2" cellpadding="9">

                        <h:outputText id="labelVenue" value="#{bundle['venue']} " style="font-weight: bold" />

                        <h:column id="venue">
                            <h:outputText value="#{editEventManagedBean.eventActivity.venue.blkNumber}" 
                                          id ="eventBlk" />

                            <h:outputText value="#{editEventManagedBean.eventActivity.venue.buildingName}" 
                                          id ="eventBuilding"/>
                            <h:outputText value=" ,"/>
                            <h:outputText value=" #{editEventManagedBean.eventActivity.venue.streetName}" 
                                          id ="eventStreet" />
                            <h:outputText value=" ,"/>

                            <h:outputText value="#{editEventManagedBean.eventActivity.venue.unitNumber}" 
                                          id ="eventUnit" />
                            <h:outputText value=" , Postal Code "/>
                            <h:outputText id="postalCode" value="#{editEventManagedBean.eventActivity.venue.postalCode}"/>

                        </h:column>




                    </h:panelGrid>

                    <p:separator />     

                    <h:panelGrid columns="4" cellspacing="2" cellpadding="9">
                        <h:outputLabel id="pstartDate" value ="From" style="font-weight: bold" />

                        <h:column>
                            <h:outputLabel id="calEventStartDate" value="#{editEventManagedBean.eventActivity.when.startDate}">
                                <f:convertDateTime dateStyle="medium" timeZone="UTC+8"/>
                            </h:outputLabel>


                            <h:outputLabel id="pEndDatelabel" value ="-" style="font-weight: bold" />
                            <h:outputLabel id="calEventEndDate" value="#{editEventManagedBean.eventActivity.when.endDate}">
                                <f:convertDateTime dateStyle="medium" timeZone="UTC+8"/>
                            </h:outputLabel>
                        </h:column>

                        <h:outputLabel id="eventStartTime" style="font-weight: bold" value ="Time: "/>
                        <h:column>
                            <h:outputText id="eventStartTimeddl" value="#{editEventManagedBean.eventActivity.when.openingHoursEnum}" converter="operatingHoursConverter"/>


                            <h:outputLabel id="eventEndTime" style="font-weight: bold" value="-  "/>
                            <h:outputText id="eventEndTimeddl" value="#{editEventManagedBean.eventActivity.when.closingHoursEnum}" converter="operatingHoursConverter" />

                        </h:column>

                    </h:panelGrid>
                    <p:separator />     

                    <h:panelGrid columns="4" cellspacing="2" cellpadding="9" >

                        <h:outputText id="labelTicketTitle" value="#{bundle['ticket.title']} " style="font-weight: bold; width: 180px;"
                                      rendered="${editEventManagedBean.ticket.ticketName!=''}" />

                        <h:outputText value="#{editEventManagedBean.ticket.ticketName}" 
                                      id ="ticketTitle" style="width:310px;" rendered="${editEventManagedBean.ticket.ticketName!=''}" />


                        <h:outputText id="labelTicketPrice" value="#{bundle['ticket.price']} " style="font-weight: bold;" />




                        <h:outputText value="Free" id ="ticketFree" style="width:280px;" rendered="${editEventManagedBean.ticket.price == 0}" />

                        <h:outputText value="#{editEventManagedBean.ticket.price}" 
                                      id ="ticketPrice" style="width:280px;" rendered="${editEventManagedBean.ticket.price >0}" >

                            <f:convertNumber currencySymbol="$" groupingUsed="#{true}" maxFractionDigits="2" type="currency" />
                        </h:outputText>





                    </h:panelGrid>


                </p:panel>
                <p:ajaxStatus>  
                    <f:facet name="start">  
                        <h:graphicImage value="../design/ajaxloading.gif" />  
                    </f:facet>  

                    <f:facet name="complete">  
                        <h:outputText value="" />  
                    </f:facet>  
                </p:ajaxStatus> 
            </h:body>

        </f:view>
    </ui:define>
</ui:composition>
